import { ref, computed } from 'vue'
export default function getTableAttrs(column, height) {
  let tbodyHeight = ref(500) //  tbody的高度
  let tbodyWidth = ref(0) // tobdy 宽度
  let superTableRef = ref(null) // 组件DOM ref实例
  let hasScrollX = ref(false)

  let getColumnTotalWidth = function (array) {
    let total = 0
    array.forEach(c => {
      if (c.width) total += c.width
      else {
        if (c.children) {
          total += getColumnTotalWidth(c.children, total)
        } else {
          total += c.title.length * 12 + 14 + 24
        }
      }
    })
    return total
  }
  // 是否需要横向滚动条
  let isScrollX = function () {
    let wrapperWidth = superTableRef.value.getBoundingClientRect().width;
    let dataWidth = getColumnTotalWidth(column.value) + 35
    if (wrapperWidth < dataWidth) {
      tbodyWidth.value = dataWidth;
      hasScrollX.value = true
    } else {
      tbodyWidth.value = 0;
      hasScrollX.value = false
    }
  }

  // 设置表头宽度
  let setWidth = (row) => {
    if (row.width) {
      return {
        width: `${row.width}px`,
      };
    } else {
      if (row.fixed) {
        return {
          width: `${row.title.length * 12 + 14 + 24}px`,
        }
      } else {
        if (!hasScrollX.value) {
          return {
            flex: 1
          }
        } else {
          if (row.children) return { flex: 1 }
          return {
            width: `${row.title.length * 12 + 14 + 24}px`,
          }
        }
      }
      ;
    }
  }
  let tableHeight = computed(() => {
    return {
      height: `${height.value}px`
    }
  })
  return {
    tbodyHeight,
    tableHeight,
    tbodyWidth,
    superTableRef,
    isScrollX,
    setWidth
  }
}